import React from 'react'
import PropTypes from 'prop-types'
import axios from 'axios'
import {api} from '../../utils/config'
import {Modal, Icon, Button, message} from 'antd'
import styles from './../../themes/common.less'
import {education, jobStatus, getObjectURL} from '../../utils/index'
import tximg from '../../../assets/images/tximg.png'

const model = ({
                 item = {},
                 onOk,
                 editPwd,
                 onEditPhone,
                 updateStates,
                 ...modalProps
               }) => {

  const handleOk = () => {
    onOk(item)
  }
  const handlePwd = () => {
    editPwd(item)
  }

  const modalOpts = {
    ...modalProps,
    onOk: handleOk,
    editPwd: handlePwd
  }

  let currentUserservs = item.servs;
  currentUserservs = currentUserservs ? currentUserservs.split('/') : [];
  let _serArr = [];
  if (currentUserservs) {
    for (let info of currentUserservs) {
      _serArr.push(info.split(',')[1])
    }
  }

  let roleList = modalProps.roleList;
  let childs = [];
  if (roleList) {
    for (let info of roleList) {
      childs.push(<Option key={info.role_id}>{info.role_name}</Option>)
    }
  }

  let _roles = item.roles
  let jobs = '';
  if (_roles) {
    let _jobs = [];
    let _arr = _roles.split('/');
    for (let item of _arr) {
      _jobs.push(item.split(',')[1]);
    }
    jobs = _jobs.join('/');
  }



  const selectAvatar = () => {
    document.getElementById('avatar').click();
  }

  const changeAvatarFile = () => {
    const fs = document.getElementById('avatar');
    if (fs.files) {
      const form = document.getElementById('userInfoForm');
      form.method = "post";
      let formData = new FormData(form);
      formData.append('action', api.modifyPersonInfo);
      /*formData.append('avatar', fs.files[0]);*/
      axios({
        url: api.modifyPersonInfo,
        method: 'post',
        data: formData,
        headers: {'Content-Type': 'multipart/form-data'}
      }).then((res) => {
        const code = res.data.code;
        const mes = res.data.message;
        if (code == '000000') {
          message.success('修改当前用户头像成功!')
          var objUrl = getObjectURL(fs.files[0]);
          updateStates(objUrl);
        } else {
          message.error(mes)
        }
      })

    }
  }

  return (
    <form id="userInfoForm" method='post'>
      <input name="baseListFile" type="file" multiple id="avatar" onChange={changeAvatarFile}
           accept="image/*"
           style={{display: 'none'}}/>
      <img src={item.avatar ? item.avatar : tximg} alt="头像" name="avatar" id="avatar"
         style={{width: '110px', height: '125px', border: '1px solid #ececec'}} onClick={selectAvatar}/>
    </form>

  )
}

model.propTypes = {
  type: PropTypes.string,
  item: PropTypes.object,
  onOk: PropTypes.func,
  editPwd: PropTypes.func,
  onEditPhone: PropTypes.func,
  dispatch: PropTypes.func,
}

export default model
